import echarts from 'echarts'
const install = function (Vue) {
  Object.defineProperties(Vue.prototype, {
    $chart: {
      get() {
        return {
          //画一条简单的线
          line: function (id, optionData) {
            this.chart = echarts.init(document.getElementById(id));
            this.chart.clear();
            this.chart.setOption(optionData);
          },
          /*
          min 最小值
          max 最大值
          data x轴的刻度(keyList)和对应值(valueList)
          */
          getOption: function (yLow, yHigh, min, max, data, unit) {


            console.log("unit:" + unit);

            var isHideMin = false;
            var isHideMax = false;

            if (min == null) {
              isHideMin = true;
            }

            if (max == null) {
              isHideMax = true;
            }

            //为了保证图在第一象限上对数值作一下处理(负数变正数)
            var diff = 0.0;

            if (yLow < 0) {
              diff = yLow * -1;
              for (var i = 0; i < data.valueList.length; i++) {
                data.valueList[i] = data.valueList[i] + diff;
              }
            }

            let yDiff = ((yHigh - yLow) / 10);
            yLow = yLow + diff - yDiff
            yHigh = yHigh + diff + yDiff;

            min = min + diff;
            max = max + diff;


            var lineData = [];
            if (!isHideMin) {
              console.log("显示min");
              lineData.push([{
                  symbol: 'none',
                  label: {
                    normal: {
                      position: 'end',
                      formatter: '最低: ' + (min - diff), //显示的时候减掉误差值
                      color: '#8DA2C4',
                    }
                  },
                  coord: [data.keyList[0], min],
                },
                {
                  symbol: 'none',
                  x: '80.5%',
                  yAxis: min,
                },
              ]);
            }
            if (!isHideMax) {
              console.log("显示max");
              lineData.push([{
                  symbol: 'none',
                  label: {
                    normal: {
                      position: 'end',
                      formatter: '最高: ' + (max - diff), //显示的时候减掉误差值
                      color: '#8DA2C4',
                    }
                  },
                  coord: [data.keyList[0], max],
                },
                {
                  symbol: 'none',
                  x: '80.5%',
                  yAxis: max,
                },
              ]);
            }


            return {
              animation: false,
              backgroundColor: '#1B458A',
              textColor: '#8DA2C4',

              //x轴相关设置
              xAxis: {
                data: data.keyList,
                type: 'category',
                boundaryGap: false,
                position: "bottom",
                axisTick: { //坐标轴刻度相关设置
                  alignWithLabel: true,
                  lineStyle: {
                    color: '#ccc'
                  }
                },
                axisLine: {
                  lineStyle: {
                    color: '#8DA2C4' //坐标轴线颜色
                  },
                  //使x不在0刻度上交叉
                  onZeroAxisIndex: -1,

                },
                //轴样式
                axisLabel: {
                  textStyle: {
                    color: '#8DA2C4'
                  }
                },
                // 输出在提示框的内容
                axisPointer: {
                  label: {
                    formatter: function (params) {
                      return '时间:  ' + params.value;
                    }
                  }
                },
              },
              //Y轴
              yAxis: {
                show: false,
                type: 'value',
                axisLabel: {
                  textStyle: {
                    color: '#8DA2C4'
                  }
                },
                axisLine: {
                  lineStyle: {
                    color: '#8DA2C4'
                  }
                },
                //最大值(辅助线之外再留点空隙)
                max: yHigh,
                //最小值(辅助线之外再留点空隙)
                min: yLow
              },
              //内容
              series: [{
                data: data.valueList,
                name: '值',
                type: 'line',
                areaStyle: {},
                smooth: true,
                //不显示点
                symbol: 'none',
                itemStyle: {
                  normal: {
                    color: {
                      type: 'linear',
                      x: 0,
                      y: 0,
                      x2: 0,
                      y2: 1,
                      colorStops: [{
                        offset: 0,
                        color: 'rgba(79, 125, 204, 1.0)' // 0% 处的颜色
                      }, {
                        offset: 1,
                        color: 'rgba(79, 125, 204, 0.0)' // 100% 处的颜色
                      }],
                      global: false // 缺省为 false
                    },
                    lineStyle: {
                      color: "#8DA2C4",
                    }
                  }
                },
                markLine: {
                  itemStyle: {
                    normal: {
                      borderWidth: 0.5,
                      lineStyle: {
                        color: '#8DA2C4',
                        width: 0.5
                      },
                    }
                  },
                  symbol: "none", //去掉警戒线最后面的箭头
                  data: lineData.length > 0 ? lineData : null
                },
              }],
              //提示框
              tooltip: {
                trigger: 'axis',
                formatter: function (params, ticket, callback) {
                  var res = '<p style="text-align:left;">时间: ' + params[0].name;
                  for (var i = 0; i < params.length; i++) {
                    //显示的时候减掉误差值
                    res += '<br>' + params[i].seriesName + ': ' + Number((params[i].data - diff).toFixed(2)) + unit;
                  }
                  return res + '</p>';

                }
              },
            };
          }
        }
      }
    }
  })
}
export default {
  install
}
